<template>
  <div class="execution">
    <basic-container>
      <avue-crud
        v-model="form"
        v-bind="bindVal"
        v-on="onEvent"
        :page.sync="page"
        :permission="permissionList"
        :before-close="beforeClose"
	      :row-style="rowStyle">
        <template slot-scope="scope" slot="menuLeft">
          <!-- <el-button  type="primary" size="small" @click="jieyong(scope.row,scope.index)">下载</el-button> -->
          <el-button type="primary" size="small"
            v-permission="permissionList.exportBtn"
            @click="handleExport">导 出</el-button>
          <el-button type="primary" size="small" :hidden="true" v-if="false" @click="handlePrint">打 印</el-button>
        </template>
        <template slot-scope="scope" slot="menu">
          <el-button
            :type="scope.type"
            :size="scope.size"
            v-if="scope.row.isReceive=='否'"
            v-permission="permissionList.borrowBtn"
            @click="jieyong(scope.row,scope.index)"
          >借用</el-button>
          <el-button
            :type="scope.type"
            :size="scope.size"
            v-if="scope.row.isReceive=='是'&&scope.row.isReturn=='否'"
            v-permission="permissionList.returnBtn"
            @click="guihuan(scope.row,scope.index)"
          >归还</el-button>
          <el-button :type="scope.type" :size="scope.size" @click="yulan(scope.row,scope.index)">预览</el-button>
        </template>
      </avue-crud>
    </basic-container>
    <open-dialog :DialogVisible.sync="borrowVisDialog" title="借用" width="80%">
      <el-form label-width="60px">
        <avue-form ref="borrowForm" v-model="form" :option="tableOptionJieYong" style="margin-bottom:40px;">
        </avue-form>
        <div class="bottom-menu-borrow-return">
          <el-button type="primary" @click="confirmBorrow">确认</el-button>
          <el-button type="primary" @click="borrowVisDialog=false">取消</el-button>
        </div>
      </el-form>
    </open-dialog>
    <open-dialog :DialogVisible.sync="GuiHuanVisDialog" title="归还" width="80%">
      <el-form label-width="60px">
        <avue-form ref="returnForm" v-model="form" :option="tableOptionGuiHuan" style="margin-bottom:40px;">
          <template slot="inputStockno" slot-scope="{row, dic}">
            <avue-select
              v-model="form.inputStockno"
              :dic="dic"
              :props="inputStocknoProps"
              filterable
              @change="onInputStocknoChange(dic)">
            </avue-select>
          </template>
        </avue-form>
        <div class="bottom-menu-borrow-return">
          <el-button type="primary" @click="confirmReturn">确认</el-button>
          <el-button type="primary" @click="GuiHuanVisDialog=false">取消</el-button>
        </div>
      </el-form>
    </open-dialog>
    <open-dialog :DialogVisible.sync="YuLanVisDialog" title="预览" width="80%">
      <el-form label-width="60px">
        <avue-form v-model="form" :option="tableOptionGuiHuanView" style="margin-bottom:40px;"></avue-form>
        <div class="bottom-menu-borrow-return">
          <el-button type="primary" @click="YuLanVisDialog=false">取消</el-button>
        </div>
      </el-form>
    </open-dialog>
  </div>
</template>

<script>
import baseCrud from '@/mixins/base-crud'
import {
  tableOption,
  tableOptionJieYong,
  tableOptionGuiHuan,
  tableOptionGuiHuanView,  
} from "@/const/crud/subway/swstticketborrowreturn";
import { putObj,getKeeperCodeByCondition } from '@/api/subway/swstticketborrowreturn'
import { dateFormat } from '@/util/date.js'
import moment from 'moment';

export default {
  name: "StTicketBorrowReturn",
  mixins: [baseCrud('subway/swstticketborrowreturn')],
  data() {
    return {
      form1: {},
      tableOptionJieYong: tableOptionJieYong,
      tableOptionGuiHuan: tableOptionGuiHuan,
      tableOptionGuiHuanView:tableOptionGuiHuanView,
      borrowVisDialog: false,
      GuiHuanVisDialog: false,
      YuLanVisDialog: false,
      inputStocknoProps: {
        label: 'instockno',
        value: 'instockno',
        res: 'data.records'
      }
    };
  },
  computed: {
    permissionList() {
      return {
        borrowBtn: this.vaildData(this.permissions.st_ticket_borrow_return_borrow, false),
        returnBtn: this.vaildData(this.permissions.st_ticket_borrow_return_return, false),
        exportBtn: this.vaildData(this.permissions.st_ticket_borrow_return_export, false),
      };
    },
  },
  methods: {
    //颜色特殊标识
    rowStyle({ row, column, rowIndex }) {
      if (moment(row.borrowTime).add(6,'months')<moment()&&this.validatenull(row.returnTime)) {
        return {
          backgroundColor: "#eee",
          color: "red",
        };
      }
    },
    jieyong(row, index) {
      this.form = row
      this.borrowVisDialog = true
      if(this.form.borrowPersonCode==null || this.form.borrowPersonCode==''){
         this.form.borrowPersonCode = this.form.outputPersonCode;
         this.form.borrowPersonName = this.form.outputPersonName;
      }
    },
    confirmBorrow(){
      this.$refs.borrowForm.validate(valid => {
        this.form.isReceive = '是'
        putObj(this.form).then(data => {
          this.$message.success('借用成功')
          this.borrowVisDialog = false
          this.getList(this.page)
        }).catch(() => {
          loading()
        })
      })
    },
    guihuan(row, index) {
      this.form = row
      this.GuiHuanVisDialog = true;
    },
    yulan(row, index) {
      this.form = row;
      this.form1=row;
      this.YuLanVisDialog = true;
    },
    beforeClose(done, type) {
      this.tableOption = tableOption;
      done();
    },
    onInputStocknoChange(dic){
      if(!this.validatenull(this.form.inputStockno)){
           //同时获取出库人信息
	   getKeeperCodeByCondition(this.form.inputStockno).then(res => {
	  
      if ((res && res.data.data.keepercode) || (res && res.data.data.keepername)) {
     
        this.form.returnPersonName = res.data.data.keepername;
        this.form.returnPersonCode = res.data.data.keepercode;
        this.form.returnTime = res.data.data.inGoingTime;
      }else{
        this.form.returnPersonCode ='';
        this.form.returnPersonName ='';	    
        this.form.returnTime = ''; 
      }
	   });
        for(let d of dic){
          if(this.form.inputStockno === d.instockno){
            this.form.returnNumber = d.ticketNumber
            this.form.returnNumberRemain = this.form.borrowNumber - d.ticketNumber	   
            break
          }
        }
      }else {
        this.form.returnNumber = undefined
        this.form.returnNumberRemain = undefined
      }
    },
    confirmReturn(){
      this.$refs.returnForm.validate(valid => {
        if(valid){
          this.form.isReturn = '是'
          //this.form.returnTime = dateFormat(new Date())
          putObj(this.form).then(response => {
            this.$message.success('归还成功')
            this.GuiHuanVisDialog = false;
            this.getList(this.page)
          })
        }
      })
    }
  }
}
</script>

<style lang="scss">
.header {
  margin: 0 auto;
  width: 99%;
  padding: 5px 10px;
  border: 1px solid #e4e4e4;
  border-bottom: none;
  background-color: #eee;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.bottom-menu-borrow-return {
  margin-top: 48px;
  text-align: center;
}
</style>
